<%@ include file="../common/header.jsp" %>

<div class="content">
    <%@ include file="../common/top_nav.jsp" %>

    <div class="container mt-4">
        <h2>设备维护记录管理</h2>

        <!-- 新增按钮 -->
        <button class="btn btn-primary mb-3" data-bs-toggle="modal" data-bs-target="#maintenanceModal"
                onclick="prepareAdd()">新增维护记录
        </button>

        <!-- 维护记录列表 -->
        <table class="table table-bordered">
            <thead>
            <tr>
                <th>设备ID</th>
                <th>维护日期</th>
                <th>维护内容</th>
                <th>维修人员</th>
                <th>操作</th>
            </tr>
            </thead>
            <tbody>
            <c:forEach var="item" items="${list}">
                <tr>
                    <td>${item.deviceId}</td>
                    <td>${item.maintenanceDate}</td>
                    <td>${item.maintenanceDescription}</td>
                    <td>${item.technicianName}</td>
                    <td>
                        <button class="btn btn-warning btn-sm" data-bs-toggle="modal" data-bs-target="#maintenanceModal"
                                onclick="prepareEdit(${item.id})">编辑</button>
                        <a class="btn btn-danger btn-sm" href="<c:url value='/maintenance/delete/${item.id}'/>">删除</a>
                    </td>
                </tr>
            </c:forEach>
            </tbody>
        </table>
    </div>
</div>

<!-- 模态框 -->
<div class="modal fade" id="maintenanceModal" tabindex="-1" aria-labelledby="maintenanceModalLabel" aria-hidden="true">
    <div class="modal-dialog">
        <div class="modal-content">
            <form id="maintenanceForm" method="post" action="<c:url value='/maintenance/add'/>">
                <div class="modal-header">
                    <h5 class="modal-title" id="maintenanceModalLabel">新增维护记录</h5>
                    <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="关闭"></button>
                </div>
                <div class="modal-body">
                    <input type="hidden" id="id" name="id">

                    <div class="mb-3">
                        <label for="deviceId" class="form-label">设备ID</label>
                        <input type="number" class="form-control" id="deviceId" name="deviceId" required>
                    </div>

                    <div class="mb-3">
                        <label for="maintenanceDate" class="form-label">维护日期</label>
                        <input type="date" class="form-control" id="maintenanceDate" name="maintenanceDate" required>
                    </div>

                    <div class="mb-3">
                        <label for="maintenanceDescription" class="form-label">维护内容</label>
                        <textarea class="form-control" id="maintenanceDescription" name="maintenanceDescription" rows="3" required></textarea>
                    </div>

                    <div class="mb-3">
                        <label for="technicianName" class="form-label">维修人员</label>
                        <input type="text" class="form-control" id="technicianName" name="technicianName" required>
                    </div>

                </div>
                <div class="modal-footer">
                    <button type="submit" class="btn btn-success">保存</button>
                    <button type="button" class="btn btn-secondary" data-bs-dismiss="modal">取消</button>
                </div>
            </form>
        </div>
    </div>
</div>

<%@ include file="../common/footer.jsp" %>

<script>
    function prepareAdd() {
        document.getElementById("maintenanceModalLabel").innerText = "新增维护记录";
        document.getElementById("maintenanceForm").action = "<c:url value='/maintenance/add'/>";
        document.getElementById("id").value = "";
        document.getElementById("deviceId").value = "";
        document.getElementById("maintenanceDate").value = "";
        document.getElementById("maintenanceDescription").value = "";
        document.getElementById("technicianName").value = "";
    }

    function prepareEdit(id) {
        fetch("<c:url value='/maintenance/get/'/>" + id, {
            headers: {
                "Accept": "application/json"
            }
        }).then(response => {
            if (!response.ok) throw new Error("请求失败: " + response.status);
            return response.json();
        }).then(data => {
            document.getElementById("maintenanceModalLabel").innerText = "编辑维护记录";
            document.getElementById("maintenanceForm").action = "<c:url value='/maintenance/update'/>";
            document.getElementById("id").value = data.id;
            document.getElementById("deviceId").value = data.deviceId;
            document.getElementById("maintenanceDate").value = data.maintenanceDate;
            document.getElementById("maintenanceDescription").value = data.maintenanceDescription;
            document.getElementById("technicianName").value = data.technicianName;
        }).catch(error => {
            console.error("加载失败:", error);
            alert("获取维护记录失败！");
        });
    }
</script>
